import 'package:flutter/material.dart';

/*
Scaffold 实现了Material 风格的基本布局结构，它提供了展示drawers、snack
bars 和bottom sheets 的功能。
*/
class SampleScaffoldWidget extends StatelessWidget {
  const SampleScaffoldWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          title: Text("Scaffold示例"),
        ),
        body: _SampleScaffoldWidget(),
        // 左侧侧滑菜单
        drawer: Drawer(
          child: Container(
            color: Colors.blue,
            child: Center(
              child: Text("左侧菜单"),
            ),
          ),
        ),
        // 右侧侧滑菜单
        endDrawer: Drawer(
            child: Container(
          color: Colors.deepOrangeAccent,
          child: Center(
            child: Text("右侧菜单"),
          ),
        )),
        // 底部导航栏
        bottomNavigationBar: BottomNavigationBar(
          items: [
            BottomNavigationBarItem(title: Text("老孟"), icon: Icon(Icons.person)),
            BottomNavigationBarItem(title: Text("程序员"), icon: Icon(Icons.home)),
            // BottomNavigationBarItem(title: Text("我的"), icon: Icon(Icons.perm_identity))
          ],
        ),
        // 控制floatingactionbar的位置
        floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
        floatingActionButton: Builder(
          builder: (BuildContext context) {
            // 需要结合Builder使用
            return FloatingActionButton(
              elevation: 7.0,
              highlightElevation: 14.0,
              tooltip: 'hello',
              foregroundColor: Colors.white,
              backgroundColor: Colors.black,
              heroTag: null,
              mini: false,
              shape: CircleBorder(),
              isExtended: false,
              onPressed: () {
                Scaffold.of(context).showSnackBar(SnackBar(content: Text("小清新")));
              },
              child: const Icon(Icons.add),
            );
          },
        ),
        // persistentFooterButtons 位于body 之下，bottomNavigationBar 之上，不会随着
        // body 滚动而滚动
        persistentFooterButtons: [
          FlatButton(onPressed: () {}, child: Text("FlatButton")),
          FlatButton(onPressed: () {}, child: Text("FlatButton")),
        ],
        // bottomSheet 位于persistentFooterButtons 之上，
        // 这里是固定的，要动态显示需要使用showBottomSheet
        // bottomSheet: buildBottomSheet(),
      ),
    );
  }

  BottomSheet buildBottomSheet() {
    return BottomSheet(
      onClosing: () {},
      backgroundColor: Colors.lightBlue,
      builder: (context) {
        return Container(
          height: 150,
          alignment: Alignment.center,
          child: Text('BottomSheet'),
        );
      },
    );
  }
}

class _SampleScaffoldWidget extends StatefulWidget {
  const _SampleScaffoldWidget({Key? key}) : super(key: key);

  @override
  __SampleScaffoldWidgetState createState() => __SampleScaffoldWidgetState();
}

class __SampleScaffoldWidgetState extends State<_SampleScaffoldWidget> {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        children: [
          Text("一枚有态度的程序员"),
          RaisedButton(
            child: Text("show bottom sheet"),
            onPressed: () {
              showBottomSheet(
                  context: context,
                  builder: (_) => Column(
                        children: [
                          Container(
                            height: 200,
                            width: double.infinity, // 添加这个，才会撑满全屏
                            color: Colors.red,
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.end, // 添加这个才会让按钮在最底部
                              children: [
                                RaisedButton(
                                  onPressed: () {
                                    Navigator.of(context).pop();
                                  },
                                  child: Text('确定'),
                                ),
                                RaisedButton(
                                  onPressed: () {
                                    Navigator.of(context).pop();
                                  },
                                  child: Text('取消'),
                                )
                              ],
                            ),
                          )
                        ],
                      ));
            },
          )
        ],
      ),
    );
  }
}
